<template>
  <d2-container>
    <el-main>

      <h3>节假日名称</h3>
      <el-input placeholder="请输入节假日名称" v-model="name" :disabled="disabled"></el-input>

      <h3>节假日描述</h3>
      <el-input placeholder="请输入节假日描述" v-model="description" :disabled="disabled"></el-input>

      <h3>假期开始时间</h3>
      <el-date-picker
              v-model="startTime"
              type="date"
              placeholder="选择日期时间">
      </el-date-picker>

      <h3>假期结束时间</h3>
      <el-date-picker
              v-model="endTime"
              type="date"
              placeholder="选择日期时间">
      </el-date-picker>


<!--      <h3>选择校区</h3>-->
<!--      <el-select v-model="school" filterable placeholder="可输入名称搜索" @change="schoolSelected" :disabled="disabled">-->
<!--        <el-option-->
<!--                v-for="item in schoolList"-->
<!--                :key="item._id"-->
<!--                :label="item.name"-->
<!--                :value="item._id"-->
<!--        ></el-option>-->
<!--      </el-select>-->


<!--      <h3>选择部门</h3>-->
<!--      <el-checkbox-group v-model="department">-->
<!--        <el-checkbox-button v-for="value in departmentList" :label="value._id" :key="value._id">{{value.name}}</el-checkbox-button>-->
<!--      </el-checkbox-group>-->



    </el-main>
    <el-footer>
      <el-button type="primary" @click="submit">提交</el-button>
      <el-button @click="edit" v-show="editShow">修改</el-button>
    </el-footer>
  </d2-container>
</template>

<script>
  // import { request } from "http";
  import request from "@/plugin/axios";
  import {constants} from "crypto";
import { mapState } from "vuex";

  export default {
    data() {
      return {
        editShow: false,
        disabled: false,
        schoolList: [],
        name: undefined,
        description: undefined,
        startTime: undefined,
        endTime: undefined,
        departmentList: [],
        department: [],
        school: [],
        room: undefined,
        staff: [],
        outStaff: [],
        studentLimit: undefined
      };
    },
      computed:{
    ...mapState('d2admin/user',['info'])
  },
    methods: {
      submit() {
        if(this.startTime>this.endTime){
            this.$alert('结束时间需晚于开始时间', '请修改假期时间', {
              confirmButtonText: '确定',
              callback: action => {
              }
            });
              return false
        }
        let data = {};
        data.name = this.name;
        data.school = this.school;
        data.description = this.description;
        data.startTime = this.startTime;
        data.endTime = this.endTime;
        data.department = this.department;
        data.staff = this.staff;
        data.outStaff = this.outStaff;


        let url = "/holidayRecord/addHolidayRecord";

        request({
          url: url,
          method: "post",
          data
        }).then(res => {
          if (res.code == 200) {
            this.refresh = true
            

            this.$alert("", "提交成功", {
              confirmButtonText: "确定"
            });
            this.name = undefined
            this.school = undefined
            this.description = undefined
            this.startTime = undefined
            this.endTime = undefined
            this.department = undefined
            this.staff = undefined
            this.outStaff = undefined
            this.$router.push({path:"/holiday-list"})
          }
          // 返回数据
        });
      },
      edit() {
        this.disabled = false;
      },
      getSchoolList(page, pageSize) {
        let data = {};
        (data.page = page), (data.pageSize = pageSize);
        request({
          url: "/school/getSchoolList",
          method: "post",
          data
        }).then(res => {
          this.schoolList = res.data.school;
          // 返回数据
        });
      },
      

      schoolSelected() {
        this.getDepartmentList(1, 9999, this.school);
      },
      getDepartmentList(page, pageSize, school) {
        let data = {};
        (data.page = page), (data.pageSize = pageSize), (data.school = school);
        request({
          url: "/department/getDepartmentList",
          method: "post",
          data
        }).then(res => {
          this.departmentList = res.data.department;
        });
      },
    },
        beforeRouteLeave(to,from,next){
        if (this.refresh){
          to.meta.refresh = 'a'
          this.refresh = undefined
        }
        if (this.$route.query.id == undefined){
            from.meta.keep = true
            from.meta.description = this.description
            from.meta.endTime = this.endTime
            from.meta.startTime = this.startTime
            from.meta.name = this.name
        }

        next()
        },
        beforeRouteEnter(to,from,next){
            if (to.meta.keep){
                to.meta.keep = undefined
                next(v=>{
                  v.description = to.meta.description
                  to.meta.description = undefined
                  v.endTime = to.meta.endTime
                  to.meta.endTime = undefined
                  v.startTime = to.meta.startTime
                  to.meta.startTime = undefined
                  v.name = to.meta.name
                  to.meta.name = undefined
                })
            }
            else{
                next()
            }

        },

    created() {
      if (this.$route.query.id != undefined) {
        this.editShow = true;
        this.disabled = true;
      }
          this.school = this.info.school[0]._id

      // this.getSchoolList(1, 99999);
    }
  };
</script>
